<template>
  <t-space direction="vertical">
    <h3>尝试使用table展开更多</h3>
    <t-table
        :data="tableList"
        :columns="columns"
        cell-empty-content="-"
        resizable lazy-load
        table-layout="auto"
        :max-height="200"
        stripe
        :loading="fetchLoadingStatus">
    </t-table>
    <t-pagination v-model="current" v-model:pageSize="pageSize" :total="total" show-sizer
                  :page-size-options="[20, 30, 50, 100]" @page-size-change="onPageSizeChange"
                  @current-change="onCurrentChange" style="margin-top: 10px;" />
  </t-space>

</template>
<script lang="ts" setup>
import { ref, watch, computed,onMounted } from 'vue';
const fetchLoadingStatus = ref(false)
let tableList = ref([
  {
    "id": 1,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "访客"
    ],
    "data_time": [
      "2023-11-06",
      "2023-11-06"
    ],
    "data_file": [
      "无效CashRegister存档.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "如果您需要在 Vue2.7 中使用 tdesign-vue 请安装 tdesign-vue@naruto 或在具体指定版本后加-naruto的标识",
    "download_file": "",
    "status": 4,
    "order_no": "83365731-6053-4cb5-8349-c159b1039c76",
    "create_time": "2023-10-18"
  },
  {
    "id": 2,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "会议室",
      "餐饮"
    ],
    "data_time": [
      "2023-10-18",
      "2023-11-19"
    ],
    "data_file": [
      "微卡商户树_20230927.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "内部审核",
    "download_file": "",
    "status": 5,
    "order_no": "5b033557-fae5-4d7a-9f4a-474db3de6453",
    "create_time": "2023-10-18"
  },
  {
    "id": 3,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "餐饮",
      "会议室"
    ],
    "data_time": [
      "2023-10-18",
      "2023-11-08"
    ],
    "data_file": [
      "无效CashRegister存档.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "内审",
    "download_file": "",
    "status": 3,
    "order_no": "2f716bbc-45ee-4251-a0cf-03ece0cec7a8",
    "create_time": "2023-10-18"
  },
  {
    "id": 4,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "访客",
      "餐饮"
    ],
    "data_time": [
      "2023-10-19",
      "2023-11-27"
    ],
    "data_file": [
      "无效CashRegister存档.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "test",
    "download_file": "",
    "status": 1,
    "order_no": "a1a7d4f0-418d-4143-956b-cf6a6d8756ab",
    "create_time": "2023-10-18"
  },
  {
    "id": 5,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "访客"
    ],
    "data_time": [
      "2023-10-20",
      "2023-10-28"
    ],
    "data_file": [
      "餐饮规则延迟下发自费20230914.xlsx",
      "名片申请表20230918140439343.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "test",
    "download_file": "",
    "status": 1,
    "order_no": "c2192469-5989-4dce-809c-ae79cc359f51",
    "create_time": "2023-10-20"
  },
  {
    "id": 6,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "餐饮",
      "班车",
      "会议室",
      "门禁",
      "访客"
    ],
    "data_time": [
      "2023-11-01",
      "2023-11-08"
    ],
    "data_file": [
      "深圳员工早上刷卡数据.xlsx",
      "深圳地区餐饮员工早客消费数据.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "刷卡数据内审",
    "download_file": "",
    "status": 2,
    "order_no": "21bf0817-df73-4b38-9d53-65608d7ca366",
    "create_time": "2023-10-23"
  },
  {
    "id": 7,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "访客",
      "门禁"
    ],
    "data_time": [
      "2023-10-14",
      "2023-11-07"
    ],
    "data_file": [
      "微卡商户树_20230927.xlsx"
    ],
    "temp_base64": [],
    "data_desc": "内审",
    "download_file": "",
    "status": 4,
    "order_no": "bba61f83-df44-43ff-a1b6-341d439d131e",
    "create_time": "2023-10-23"
  },
  {
    "id": 8,
    "applier": "karlmfan",
    "applier_full_name": "karlmfan(范铭)",
    "data_range": [
      "访客"
    ],
    "data_time": [
      "2023-11-07",
      "2023-11-07"
    ],
    "data_file": [
      "客户名单导入模板 .xlsx"
    ],
    "temp_base64": [],
    "data_desc": "内审需求",
    "download_file": "",
    "status": 4,
    "order_no": "1bcdcfe1-86a5-4dc9-a26c-683e82956344",
    "create_time": "2023-10-23"
  }
])
const columns = ref([
  // { colKey: 'order_no', title: '订单号', width: "150px" },
  { colKey: 'applier_full_name', title: '申请人' },
  { colKey: 'data_range', title: '数据范围', },
  { colKey: 'data_time', title: '时间范围' },
  { colKey: 'status', title: '状态' },
  { colKey: 'create_time', title: '申请时间' },
  // { colKey: 'data_desc', title: '申请说明' },
  { colKey: 'operate', title: '操作' },
]);

onMounted(() => {
})




</script>normal_table.vue